import React,{useState} from 'react'
import {NavLink,useNavigate} from 'react-router-dom'
import './Role.scss'
export default function Role() {
  const nav=useNavigate()
  const [list]=useState([
    {
      id:1,
      pid:5,
      name:'平台管理员',
      level:'平台'
    },
    {
      id:2,
      pid:6,
      name:'物业管理员',
      level:'物业'
    },
    {
      id:3,
      pid:5,
      name:'停车管理员',
      level:'停车'
    }
  ])
  return (
    <div>
       <h4>角色管理</h4>
       <table>
          <thead>
            <tr>
              <td>编号</td>
              <td>名称</td>
              <td>级别</td>
              <td>操作</td>
            </tr>
          </thead>
          <tbody>
            {
              list.map(item=><tr key={item.id}>
                <td>{item.id}</td>
                <td>{item.name}</td>
                <td>{item.level}</td>
                <td>
                    {/* <NavLink to={`/home/sys/roleEdit?cid=${item.id}`}>修改</NavLink> */}
                    <button onClick={()=>{
                        nav(`/home/sys/roleEdit?cid=${item.id}`)
                    }}>修改</button>

                    <button onClick={()=>{
                       nav(`/home/sys/roleDetail/${item.id}/${item.pid}`)
                    }}>查看</button>

                    <button onClick={()=>{
                      nav(`/home/sys/roleConfig`,{state:{
                        id:item.id,
                        pid:item.pid
                      }})
                    }}>配置</button>
                </td>
              </tr>)
            }
          </tbody>
       </table>
    </div>
  )
}
